 <!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style>
			#div1
			{
				border: 0px solid salmon;
				width: 600px;
				margin: 0 auto;
			}
			#div2{
				border: 1px solid seagreen;
				width: 500px;
				margin-top: 30px;
			}
			
		</style>
		
		<script type="text/javascript">
			function deldel()
			{
				var tr=this.parentNode.parentNode;
				var name=tr.getElementsByTagName("td")[0].innerHTML;
				 var flag=confirm("确定删除"+name);
				if(flag)
				{
					tr.parentNode.removeChild(tr);
				}
				return false;
			}
			
			window.onload=function()
			{
			     var alla=document.getElementsByTagName("a");
				for(var i=0;i<alla.length;i++)
				{
					alla[i].onclick=deldel;
				}
				
				
				
				
				
				var btn01=document.getElementById("btn01");
			   btn01.onclick=function()
			{
				
				var name=document.getElementById("name").value;
			    var email=document.getElementById("email").value;
			    var salary=document.getElementById("salary").value;
			    var tr=document.createElement("tr");
			    tr.innerHTML="<td>"+name+"</td>"+
			              "<td>"+email+"</td>"+/
						  "<td>"+salary+"</td>"+
						  "<td><a href='javascript:;'>Delete</a></td>";
						  var a=tr.getElementsByTagName("a")[0];
						  a.onclick=deldel;
						  
			    var table=document.getElementById("table1");
				var tbody=table.getElementsByTagName("tbody")[0];
				tbody.appendChild(tr);	   //可以直接tbody+=后面tr什么的一起写上去，但最好不要用，这样全部的tr都相当于修改了一遍
				
			}
			}
			
			
			
		</script>
	</head>
	<body>
		<a href="">w d </a>
		<div id="div1">
		<table id="table1" width="500" border="1px" cellspacing="0px" cellpadding="0px">
		<tr>
			<td>Name</td>
		    <td>Email</td>
		    <td>Salary</td>
		    <td></td>
		</tr>
		<tr>
			<td>林润钿</td>
		    <td>distance_1819@qq.com</td>
		    <td>50000</td>
		    <td><a href="javascript:;">Delete</a></td>
		</tr>
		<tr>
			<td>戴阳</td>
		    <td>861581056@qq.com</td>
		    <td>50000</td>
		    <td><a href="javascript:;">Delete</a></td>
		</tr>
		<tr>
			<td>张恩博</td>
		    <td>3500145369</td>
		    <td>50000</td>
		    <td><a href="javascript:;">Delete</a></td>
		</tr>
		</table>
		
		<div id="div2">
			<h1>添加新员工</h1>
			<p>name:<input type="text" id="name" value="请输入名字"/> </p> 
			<p>email：<input type="text" id="email" value="请输入邮箱"/></p>
			<p>salary：<input type="text" id="salary" value="请输入工资"/></p>
			<p><input type="button" value="提交" id="btn01"></p>
		</div>
		</div>
	</body>
</html>